<style>
    img.fans-portrait{
        width:50px;
        height:50px;
    }
    .sm-rightPanel .layui-table-body .layui-table-cell {
        height: 50px;
        line-height: 50px;
    }
</style>
<div class="sm-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div class="layui-form-item wx-search" id="list_form">
            <div class="layui-inline">
                <input type="text" name="name" placeholder="请输入标签名" autocomplete="off" class="layui-input">
            </div>
            <button class="layui-btn btn-primary" id="search">查询</button>
            <div class="layui-inline right">
                <button class="layui-btn btn-danger" id="tags_sync">同步</button>
            </div>
        </div>
        <table id="list_table2" class="layui-hide" lay-filter="mainList"></table>
    	
    </div>
    <input id="select_tags" class="select_tags" type="hidden">
</div>

<script>
    layui.use(['layer', 'table'], function () {
        var layer = layui.layer;
        var table = layui.table;

        var tableObj2 = table.render({
            id: 'list_table2',
            elem: '#list_table2',
            url: '/userTag/listForPage',
            align: "center",
            cols: [[ //表头
                {type: 'checkbox'},
                {type: 'numbers', title: '编号',width:50},
                {field:'id', title: '标签编号',width:150,align: 'center'},
                {field: 'name', title: '标签名称', width: 150, align: 'center'},
                {field: 'count', title: '粉丝数量', width: 150, align: 'center'},
                {field: 'createTime', title: '创建时间', width: 180, align: 'center'}
            ]],
        });
        //table复选事件监听
        table.on('checkbox(mainList)', function(obj){
        	  console.log(obj.checked); //当前是否选中状态
        	  console.log(obj.data); //选中行的相关数据
        	  console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
        	  var data = table.checkStatus('list_table2').data;//已选中数据
        	  if (data.length == 0) {
//         		  $("#select_tags").val("");
                  return;
              }
        	  if (data.length > 1) {
        		  layer.msg("标签选择不能超过1个");
                  return;
              }
        	  for (var i = 0; i < data.length; i++) {
        		  $("#select_tags").val(data[i].id);
              }
              
        });
        // 检索
        $("#search").click(function () {
            smartAui.reloadTable(tableObj2);
        });
        // 批量同步用户标签
        $("#tags_sync").click(function () {
            layer.confirm('确认用户标签？', {
                icon: 7,
                title: "提示",
                btn: ['确认', '取消'] //按钮
            }, function () {
                smartAui.ajax({
                    loading:true,
                    url: '/wxapi/syncUserTagList',
                    success: function (result) {
                        if (result.success) {
                            layer.msg("同步成功");
                            smartAui.reloadTable(tableObj2);
                        }
                    },
                    error: function () {
                    	layer.closeAll('loading');
                        layer.msg("同步异常");
                    }
                })
            }, function () {
                layer.closeAll();
            });
        });


    });
</script>
